﻿<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<base href="<%=basePath%>">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="renderer" content="webkit|ie-comp|ie-stand">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
<meta http-equiv="Cache-Control" content="no-siteapp" />
<link href="<%=basePath%>plugins/h_uiadmin_v2.3.4/css/H-ui.min.css" rel="stylesheet" type="text/css" />
<link href="<%=basePath%>plugins/h_uiadmin_v2.3.4/css/H-ui.admin.css" rel="stylesheet" type="text/css" />
<link href="<%=basePath%>plugins/h_uiadmin_v2.3.4/lib/Hui-iconfont/1.0.7/iconfont.css" rel="stylesheet" type="text/css" />
<link rel="stylesheet" href="<%=basePath%>plugins/h_uiadmin_v2.3.4/lib/zTree/v3/css/zTreeStyle/zTreeStyle.css" type="text/css">
 <style>
.small-menu {
    position: absolute;
	width: 120px;
	z-index: 99999;
	border: solid 1px #CCC;
	background: #EEE;
	padding: 0px;
	margin: 0px;
	display: none;
}
.small-menu li {
   list-style: none;
	padding: 0px;
	margin: 0px;
}
.small-menu li A {
	color: #333;
	text-decoration: none;
	display: block;
	line-height: 20px;
	height: 20px;
	background-position: 6px center;
	background-repeat: no-repeat;
	outline: none;
	padding: 1px 5px;
	padding-left: 28px;
}
.small-menu li a:hover {
	color: #FFF;
	background-color: #3399FF;
}
.small-menu-separator {
    padding-bottom:0;
    border-bottom: 1px solid #DDD;
}
.small-menu LI.edit A { background-image: url(common/images/page_white_edit.png); }
.small-menu LI.add A { background-image: url(common/images/page_white_add.png); }
.small-menu LI.copy A { background-image: url(common/images/page_white_copy.png); }
.small-menu LI.paste A { background-image: url(common/images/page_white_paste.png); }
.small-menu LI.delete A { background-image: url(common/images/page_white_delete.png); }
.small-menu LI.quit A { background-image: url(common/images/door.png); }

</style>
<title>组织机构管理</title>
</head>
<body class="pos-r">
<div class="pos-a" style="width:220px;left:0;top:0; bottom:0; height:100%; border-right:1px solid #e5e5e5; background-color:#f5f5f5">
	<ul id="tree" class="ztree">
	</ul>
</div>
<div style="margin-left:220px;">
<nav class="breadcrumb"><i class="Hui-iconfont">&#xe67f;</i> 首页 <span class="c-gray en">&gt;</span> 系统管理 <span class="c-gray en">&gt;</span>组织机构管理<a class="btn btn-success btn-refresh radius r mr-20" style="line-height:1.6em;margin-top:3px" href="javascript:void(0);"  onclick="refresh();" title="刷新" ><i class="Hui-iconfont">&#xe68f;</i></a></nav>
<div class="pd-20">
 <form  id="queryForm" action="" method="post">
		<!-- <div class="text-c"> 
		用户名:<input type="text" class="input-text" style="width:200px" placeholder="输入用户名" id="userName" name="userName" value="">
		性别: <span class="select-box inline"><select class="select"  size="1" id="gender" name="gender" style="width:100px">
		      <option value="0" selected="selected">请选择</option>
		      <option value="1">男</option>
		      <option value="2">女</option>
		   </select></span>
		 手机号码:<input type="text" class="input-text" style="width:200px" placeholder="输入手机号" id="mobileNumber" name="mobileNumber" value="">
			<button type="button" class="btn btn-success radius" id="queryBtn" name="queryBtn"><i class="Hui-iconfont">&#xe665;</i> 搜用户</button>
	    </div> -->
	    <div style="display:none;"> <!-- 作为查询动作 -->
	       <button type="button" class="btn btn-success radius" id="queryBtn" name="queryBtn"><i class="Hui-iconfont">&#xe665;</i> 搜用户</button>
	    </div>
	    <input type="hidden" id="orgId" name="orgId" >
	</form>

	<%-- <div class="cl pd-5 bg-1 bk-gray mt-20"> <span class="l"><!-- <a href="javascript:;" onclick="datadel()" class="btn btn-danger radius"><i class="Hui-iconfont">&#xe6e2;</i> 批量删除</a> --> <a href="javascript:;" onclick="member_add('新增','<%=basePath%>usermgr/toadd','','680')" class="btn btn-primary radius"><i class="Hui-iconfont">&#xe600;</i> 新增用户</a></span> <!-- <span class="r">共有数据：<strong><span id="count"></span></strong> 条</span> --> </div>
	 --%><div class="mt-20">
	<table id="resultTable" class="table table-striped table-border table-bordered " width="100%"> <!-- table  table-bordered table-bg table-hover  table-sort -->
		<thead>
			<tr class="text-c">
				<th width="80">ID</th>
				<th width="100">用户名</th>
				<th width="40">性别</th>
				<th width="90">手机</th>
				<th width="150">邮箱</th>
				<th width="">常用地址</th>
				<th width="">所属组织机构</th>
				<th width="">身份证号码</th>
				<th width="150">操作</th>
			</tr>
		</thead>
		<tbody>
		    <tr>
				<td colspan="9"></td> 
			</tr>
			
		</tbody>
	</table>
</div>
</div>
<div>
<ul id="menu"  class="small-menu">
    <li class="add"><a href="javascript:void(0);">添加</a></li>
	<li class="edit"><a href="javascript:void(0);">编辑</a></li>
	<!-- <li class="copy"><a href="#">删除</a></li>
	<li class="small-menu-separator"></li>
	<li class="delete"><a href="#"><span class="icon icon-edit"></span>Zoom Out</a></li> -->
</ul>
</div>
<script type="text/javascript" src="<%=basePath%>plugins/h_uiadmin_v2.3.4/lib/jquery/1.9.1/jquery.min.js"></script> 
<script type="text/javascript" src="<%=basePath%>plugins/h_uiadmin_v2.3.4/lib/layer/2.1/layer.js"></script>
<script type="text/javascript" src="<%=basePath%>plugins/h_uiadmin_v2.3.4/lib/laypage/1.2/laypage.js"></script> 

<script type="text/javascript" src="<%=basePath%>plugins/h_uiadmin_v2.3.4/lib/datatables/1.10.0/jquery.dataTables.min.js"></script> 
<script type="text/javascript" src="<%=basePath%>plugins/h_uiadmin_v2.3.4/lib/zTree/v3/js/jquery.ztree.all-3.5.min.js"></script> 

<script type="text/javascript" src="<%=basePath%>plugins/h_uiadmin_v2.3.4/js/H-ui.js"></script> 
<script type="text/javascript" src="<%=basePath%>plugins/h_uiadmin_v2.3.4/js/H-ui.admin.js"></script> 
<script type="text/javascript" src="<%=basePath%>common/js/jquery.popupSmallMenu.js"></script>
<script type="text/javascript" src="<%=basePath%>common/js/dt.ext.js"></script>
<script type="text/javascript">
var resultTable = null ;
var ztree ;
var setting = {
		view: {
			//dblClickExpand: false,
			showLine: true,
			selectedMulti: false
		},
		async: {
			enable: true,
			url:"<%=basePath%>orgmgr/getorg",
			autoParam:["id"],
			//otherParam:{"otherParam":"zTreeAsyncTest"},
			dataFilter: filter
		},
		callback: {
			onClick:zTreeOnClick  ,
		    //onAsyncSuccess: zTreeOnAsyncSuccess ,
			// beforeDblClick: zTreeBeforeDblClick
			onRightClick:OnRightClick
		}
   };

function filter(treeId, parentNode, childNodes) {
	if (!childNodes) return null;
	for (var i=0, l=childNodes.length; i<l; i++) {
		childNodes[i].name = childNodes[i].name.replace(/\.n/g, '.');
	}
	return childNodes;
}

/**
 * 树的单击事件
 */
function zTreeOnClick(event,treeId,treeNode)
{
	// alert(treeNode.name+'  ' + treeNode.id) ;
	
	$("#orgId").val(treeNode.id);
	// 查询表格
    resultTable.fnReloadAjax("<%=basePath%>orgmgr/getorgusers?"+$("#queryForm").serialize()) ; 
}
/**
 * 异步回调事件
 */
function zTreeOnAsyncSuccess(event, treeId, treeNode, resp) {
   // console.log(resp) ;
    var treeObj = $.fn.zTree.getZTreeObj("tree");
    var node = treeObj.getNodeByTId("tree_5");
    if(node !=null || node != undefined  ){
    	node.isParent=false ;
    	treeObj.updateNode(node);
    	alert(4) ;
    }
    
};
/**
 * 双击事件
 */
function zTreeBeforeDblClick(treeId, treeNode) {
	//var treeObj = $.fn.zTree.getZTreeObj("tree");
	//treeObj.expandAll(true);
	refreshNode();
};
/**
 * 刷新节点重新异步加载选中的节点
 */
function refreshNode(type,newName) {
	var nodes = ztree.getSelectedNodes() ;
	if (nodes.length == 0) {
		alert("请先选择一个父节点");
	}
	if(type == 'add'){
		nodes[0].isParent=true;
		ztree.updateNode(nodes[0]);
	}else if(type=='edit'){
		nodes[0].name=newName ;
		ztree.updateNode(nodes[0]);
	}
	ztree.reAsyncChildNodes(nodes[0], "refresh");
	
}

/**
 * tree 右键菜单
 */
function OnRightClick(event, treeId, treeNode) {
	ztree.selectNode(treeNode);
	if(treeNode) {
		$("#menu").popupSmallMenu({
			event : event,
			onClickItem  : function(item) {
				rightClick(treeNode,item);
			}
		});
	}	 
}

function rightClick(treeNode,item){
	//alert(item);
	//console.log(treeNode) ;
	//console.log(treeNode.id) ;
	if(item == 'add'){
		add('新增','<%=basePath%>orgmgr/toedit?type=add&orgId='+treeNode.id ,400,270);
	}else if(item == 'edit'){
		add('修改','<%=basePath%>orgmgr/toedit?type=edit&orgId='+treeNode.id ,400,270);
	}
	return true;
}

$(function(){
	
	
	function search(){
		resultTable = $('#resultTable').dataTable({
			// "aaSorting": [[ 1, "ASC" ]],//默认第几个排序
			//"bStateSave": false,//状态保存
			//"aoColumnDefs": [
			//  {"bVisible": false, "aTargets": [ 3 ]},  //控制列的隐藏显示
			//  {"orderable":false,"aTargets":[0]}// 制定列不参与排序 
			//] ,
			//"bAutoWidth":true  ,  // 自动宽度
			"ordering": true,
    		"info":     true ,
    		"searching":     false ,
    		"pagingType": "full_numbers" , // simple  simple_numbers  full  full_numbers 
    		"lengthMenu": [ 20, 50,100 ] ,
    		// "scrollY": 400,
            // "scrollX": false ,
			"processing": true,                    //加载数据时显示正在加载信息  
	        //"bServerSide": true,                    //指定从服务器端获取数据  
	        "serverSide": true,
	        //"iDisplayLength": 9,					//每页显示10 条数据
	        "ajax": {
	               "url":"<%=basePath%>orgmgr/getorgusers",
	               "data": function ( d ) {
	                   //添加额外的参数传给服务器
	                   d.extra_search = $("#queryForm").serialize();
	               }},
	        "columns": [
	                    { "data": "id" },
	                    { "data": "userName" },
	                    { "data": "gender" },
	                    { "data": "mobileNumber" },
	                    { "data": "email" },
	                    { "data": "address" },
	                    { "data": "organizationName" },
	                    { "data": "idCard" }  ,
	                    { "data": null }  
	                  ] ,
	       "columnDefs": [ {
				    	   "targets": 1 ,
				    	   "data":null ,
				    	   render:function(a,b,c,d){
				    		   return '<a href="javascript:void(0)" style="color:red">'+c.userName+'</a>' ;
				    	       }
				          },{
				    	   "targets": 2 ,
				    	   "data":null ,
				    	   render:function(a,b,c,d){
				    		   if(c.gender == 1)
				    			   return "男" ;
				    		   else if(c.gender== 2)
				    			   return "女" ;
				    		   else
				    			   return "x" ;
				    	       }
				          },
				          { "targets": 8,
	                        "data": null,
	                         render: function (data,type,c,meta) {
	                        //	 return "<a href=\"javascript:void(0)\" onclick=\"member_edit('编辑', '"+c.id+"','','650');\">编辑</a>" ;
	                    	  var  html ="" ;
	                    	  html += "<a  title=\"编辑\" href=\"javascript:void(0)\" onclick=\"org_edit('编辑', '"+c.id+"','','650');\" class=\"ml-5\" style=\"text-decoration:none\"><i class=\"Hui-iconfont\">&#xe6df;</i>编辑</a>" ;
	                    	  html += "<a  title=\"移除\" href=\"javascript:void(0)\" onclick=\"org_remove(this, '"+c.id+"');\" class=\"ml-5\" style=\"text-decoration:none\">移除</a>" ;
	                          return html;
	                      } ,
	                       "defaultContent": "<button>Click!</button>"
	                  } ]
	         
		});
	}
	// 给最后一列加一个事件
	$('#resultTable tbody').on( 'click', 'button', function () {
		//alert(resultTable) ;
		 
        // var data = resultTable.row( $(this).parents('tr') ).data();
       // alert( data[0] +"'s salary is: "+ data[ 5 ] );
		// var id = $('#resultTable tbody tr').find("td").eq(0).text(); 
		 
    } );
	
	// 给每一行加一个事件 查看事件
	<%-- $('#resultTable tbody').on('click','tr', function () {
		    var id = $(this).find("td").eq(0).text(); 
		    member_show("查看",'<%=basePath%>usermgr/toadd?id='+id,"","650") ;
		} ); --%>
	 
	  $('#queryBtn').click(function(){
	     resultTable.fnReloadAjax("<%=basePath%>orgmgr/getorgusers?"+$("#queryForm").serialize()) ; 
		  
	});  
	
	 // init search 
	 search();
	 
    //// tree init 
	 $.fn.zTree.init($("#tree"), setting);
	 ztree = $.fn.zTree.getZTreeObj("tree");
	
});



/*用户-添加*/
function add(title,url,w,h){
	layer_show(title,url,w,h);
	
	/* var index = layer.open({
		type: 2,
		title: title,
		content: url
	});
	layer.full(index); */
	
}
/*用户-查看*/
function member_show(title,url,w,h){
	layer_show(title,url,w,h);
}
 
/*用户-编辑*/
function org_edit(title,id,w,h){
	 var url ="<%=basePath%>usermgr/toedit?userId="+id ;
	 layer_show(title,url,w,h);
}

/*-删除*/
function org_remove(obj,id){
	 zTree = $.fn.zTree.getZTreeObj("tree");
	 var  selectedNodes  = zTree.getSelectedNodes() ; // 只能单选 
	 var orgId = selectedNodes[0].id ;
	layer.confirm('确认要移除吗？',function(index){
		$.ajax({
			url:"<%=basePath%>orgmgr/removeorguser" ,
			type:'POST',
			data:{'userId':id,'orgId':orgId},
			dataType:'json',
			success:function(resp){
				 if(resp.success){
					     $(obj).parents("tr").remove();
						layer.msg('已删除!',{icon:1,time:1000});
				 }else{
					 layer.alert( resp.errMsg, {icon: 2},function(index){
						 layer.close(index);
					  });  
				 }
			}
		});
		
	});
}
 
 
/**
 * 刷新
 */
function refresh(){
	 location.replace(location.href);
}
</script> 
</body>
</html>